<template>
  <div>
    <h1>服务监控 (*¯︶¯*)</h1><hr>
    <el-descriptions class="margin-top" title="监控主机" v-model="supervisoryData" :column="3" :size="size" border>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-user"></i>
          cup的使用情况
        </template>
        {{supervisoryData.cpuUsage}}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-mobile-phone"></i>
          系统内存使用情况
        </template>
        {{supervisoryData.memoryUsage}}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-location-outline"></i>
          Jvm的使用情况
        </template>
        {{supervisoryData.jvmUsage}}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-tickets"></i>
          cup核心数
        </template>
        <el-tag size="small">{{supervisoryData.cpuNum}}</el-tag>
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-tickets"></i>
          主机名
        </template>
        <el-tag size="small">{{supervisoryData.hostName}}</el-tag>
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">
          <i class="el-icon-tickets"></i>
          ip地址
        </template>
        <el-tag size="small">{{supervisoryData.ipAddr}}</el-tag>
      </el-descriptions-item>
    </el-descriptions>
  </div>
</template>

<script>
export default {
  name: "JianKongView",
  data(){
    return{
      size: '',
      supervisoryData:{}
    }
  },methods:{
    SupervisoryControl(){
      this.axios.post("http://172.20.10.5:8003/api/tb-user/supervisoryControl").then(res=>{
        console.log("pppp"+JSON.stringify(res.data))
        this.supervisoryData=res.data
      })
    }
  },created() {
    this.SupervisoryControl();
  }
}
</script>

<style scoped>

</style>